<template>
	<view class="container">
		<!-- <image class="bg-img" src="http://tou-file.oss-cn-hangzhou.aliyuncs.com/icons/29.png"></image> -->
		<view class="content">
			<!-- <image class="logo" src="http://tou-file.oss-cn-hangzhou.aliyuncs.com/icons/27.png"></image> -->
			<!-- <view class="bigtit">
				思仁论事
			</view> -->
			<view class="title">
				以法为舟，守护万家灯火
			</view>
			
			<image class="logo1" src="/static/aidex/images/logo.jpg" mode=""></image>
			<!-- <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
				
				<image class="photo" :src="avatarUrl || '/static/aidex/images/moren.png'">
				</image>
			</button>
			<view class="tips">
				点击上传头像
			</view> -->
			<view class="from">
				<view class="item">
					<view class="name">
						*用户名
					</view>
					<input type="nickname" v-module="nickName" placeholder="请输入昵称" @blur="onBlur" />
				</view>
				<!-- <view class="item">
					<view class="name">
						*手机号
					</view>
					<view v-if="phone" class="phone">
						{{phone}}
					</view>
					<button v-else class="button" open-type="getPhoneNumber"
						@getphonenumber="decryptPhoneNumber">一键获取微信绑定号码</button>
				</view> -->
				<!-- <view class="item">
					<view class="name">
						*性别
					</view>
					<view class="radio">
						<u-radio-group v-model="sex">
							<u-radio active-color="#000000" shape="square" v-for="(item, index) in list" :key="index"
								:name="item.name">
								{{item.name}}
							</u-radio>
						</u-radio-group>
					</view>

				</view> -->
				<view class="rules">
					<u-checkbox active-color="#000000" v-model="checked"></u-checkbox>
					<view class="innerWord">我同意 <text>使用条款</text> 和 <text>隐私政策</text> 对我的个人信息进行收集和使用，我已阅读并确认已充分理解该
						使用条款 和 隐私政策 内容</view>
				</view>
				<view class="tips1">*如需修改必填项个人信息，请联系在线客服</view>
				<view  @click="register" class="btns">确认注册</view>
				<!-- <view v-else class="btns btns1">确认注册</view> -->
			</view>
		</view>
	</view>
</template>



<script>
	export default {
		data() {
			return {
				avatarUrl: '',
				avatarUrl1: '',
				nickName: "",
				phone: "",
				sex: "男",
				code: "",
				checked: false,
				list: [{
						name: '男',
						disabled: false
					},
					{
						name: '女',
						disabled: false
					},

				]
			}
		},





		onLoad(e) {
			let that = this
			uni.login({
				provider: 'weixin',
				success: function(loginRes) {
					console.log(loginRes, 8888854);
					that.code = loginRes.code

				}
			});
		},
		methods: {
			onBlur(e) {
				this.nickName = e.detail.value
			},

			register() {
				// if (!this.avatarUrl) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: "请完善您的头像"
				// 	})
				// 	return
				// }
				if (!this.nickName) {
					uni.showToast({
						icon: 'none',
						title: "请完善用户名"
					})
					return
				}

				// if (!this.phone) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: "请完善手机号"
				// 	})
				// 	return
				// }

				// if(!this.checked){
				// 	uni.showToast({
				// 		icon:'none',
				// 		title:"请阅读并同意条款！"
				// 	})
				// 	return
				// }
				let that = this;
				this.$u.api
					.userModify({
						code: this.code,
						nickname: this.nickName,
						invite_code: this.vuex_userShareCode,
						// mobile: this.phone,
						headimgurl: this.avatarUrl

					})
					.then((res) => {
						console.log(res?.data, '8888888888888');

						if (res.code === 1) {
							that.$u.toast('注册成功!');
							// that.$u.vuex("vuex_phone", res?.data?.mobile);
							that.$u.vuex("vuex_srls_token", res?.data?.token);
							that.$u.vuex("vuex_srls_isvip", res?.data?.isvip);
							// that.$u.vuex("vuex_srls_level", res?.data?.level);



							that.$u.vuex("vuex_user", res?.data);

							setTimeout(() => {
								uni.switchTab({
									url: '/pages/sys/user/index'
								})
							}, 400)

							// that.$u.vuex("vuex_sex", res?.data?.gender);

							// that.$u.vuex("vuex_nickname", res?.data?.nickname);
							// that.$u.vuex("vuex_headimg", res?.data?.headimg);

							// uni.setStorageSync('baseInfo', res?.data);

						} else {
							that.$u.toast(res.msg);
						}

					});
			},
			//授权手机号登录
			decryptPhoneNumber(e) {

				console.log(e, 3333)
				var that = this
				// #ifdef MP-WEIXIN
				if (e.detail.errMsg == 'getPhoneNumber:ok') {
					if (e.detail.iv) {

						let {
							code,
							encryptedData,
							iv
						} = e.detail

						// console.log(code,encryptedData,iv)

						// that.$u.api
						// 	.updateusermobile({
						// 		code,
						// 		encrypted_data: encryptedData,
						// 		iv
						// 	})
						// 	.then((res) => {
						// 		that.phone = res?.data?.phoneNumber
						// 	});

					} else {
						// 授权失败请使用验证码登录

						uni.showToast({
							title: '请使用手机号登录',
							icon: 'none'
						});
					}
				}
				// #endif
			},

			onChooseAvatar(e) {
				// this.avatarUrl = e.detail.avatarUrl;

				
				uni.showLoading({
				    title: '上传中...'
				});

				uni.uploadFile({
					url: this.vuex_config.baseUrl + '/file/formimage',
					header: {
						'content-type': 'multipart/form-data'
						// 'Authorization': 'Bearer ' + this.vuex_srls_token
					},
					filePath: e.detail.avatarUrl,
					name: 'file',
					formData: {
						'file': e.detail.avatarUrl
					},
					success: (uploadFileRes) => {
						uni.hideLoading();
						console.log(JSON.parse(uploadFileRes?.data))
						this.avatarUrl = JSON.parse(uploadFileRes?.data)?.data?.url;
						console.log(this.avatarUrl1, 666666)
					}
				});

			},
		}
	}
</script>

<style lang="scss" scoped>
	.logo1{
		width:131rpx;
		height: 129rpx;
		// border-radius: 50%;
		margin: 50rpx auto;
		display: block;
	}
	.container {
		padding-bottom: 138rpx;
		padding-top: 100rpx;
	}

	.bigtit {
		text-align: center;
		letter-spacing: 5rpx;
		font-size: 42rpx;
		// font-family: Source Han Sans CN;
		font-weight: 500;
		color: #000000;
		text-align: center;
		margin: 79rpx 0 39rpx;
	}

	.item {
		margin: 0 66rpx 30rpx;
		height: 88rpx;
		border: 1px solid #000000;
		display: flex;
		align-items: center;
		justify-content: space-between;

		.name {
			padding-left: 31rpx;
			padding-right: 56rpx;
			min-width: 95px;

			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 500;
			color: #000000;
		}

		input,
		button,
		.radio {
			flex: 1;
			margin-right: 61rpx;
		}

		.phone {
			flex: 1;
		}

		/deep/ button {
			height: 46rpx;
			background: #000000 !important;
			border-radius: 0 !important;
			font-size: 26rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}

	.btns {

		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #F4F4F4;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 67rpx auto 138rpx;
		width: 618rpx;
		height: 82rpx;
		background: #0fbcae;
		border-radius: 41rpx;
		&.btns1{
			background: #c7ccbf;
		}
	}

	.rules {
		margin: 30rpx 66rpx 27rpx;
		display: flex;

		.innerWord {
			font-size: 22rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #595959;
			line-height: 33rpx;
			text-align: justify;

			text {
				padding: 0 2px;
				text-decoration: underline;
			}
		}
	}

	/deep/ .u-checkbox {
		display: flex !important;
	}

	/deep/ .u-checkbox__label {
		margin-left: 0 !important;
	}

	.tips1 {

		font-size: 10px;
		transform: scale(0.8);
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #595959;
		text-align: center;
	}

	/deep/.u-radio__label {
		padding-right: 70rpx;
	}

	.bg-img {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: -1;
	}

	.logo {
		display: block;
		width: 410rpx;
		height: 55rpx;
		margin: 127rpx auto 0;
	}


	.title {
		height: 40rpx;
		font-size: 42rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #000000;
		text-align: center;
		margin: 79rpx 0 39rpx;
	}

	.avatar-wrapper {
		width: 178rpx;
		height: 178rpx;
		padding: 0;
		border: 1rpx solid #f0f0f0;
		// border-radius: 50%;

	}

	/deep/ button::after {
		border: none !important;
	}

	/deep/ button {
		border-radius: 50%;
		background-color: transparent !important;
	}

	.photo {
		display: block;
		width: 178rpx;
		height: 178rpx;
		margin: 0 auto 9rpx;
	}

	.tips {
		text-align: center;
		margin-bottom: 40rpx;
		font-size: 24rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #000000;
		line-height: 51rpx;
	}
</style>